<template>
  <div class="tab2">
    <tab-bar :tabBar="menuTabBar" :on-selected="onBarSelected"></tab-bar>
		<chart-overlap :chart-data = "chartOverlapData"></chart-overlap>
		</div>
</template>

<script>
import tabBar from '@/pages/common/TabBar'
import chartOverlap from '@/pages/common/ChartOverlap'
import remoteDAO from '@/common//remoteDAO'
import constant from '@/common/constant'
import { Loop } from '@/common/polling'

export default {
  name: 'month-chart',
  data () {
    return {
      menuTabBar: [{name: '今日'}, {name: '近一月'}, {name: '近三月'}],
      msgBar: 0,
      chartOverlapData: null,
      tabBarIndex: 0
    }
  },
  components: {
    tabBar,
    chartOverlap
  },
  methods: {
    onBarSelected (index) {
      this.msgBar = index;
      this.$store.dispatch('ctrlLoading', true);                // tab选择    loading显示
      this.$store.dispatch('ctrlError', false);
      this.fetchLastData(this.msgBar)
    },
    getIndex(type) {
      return remoteDAO.invoke(constant.InterfaceEnum.GET_INDEX, {type})
    },
    getLastData(type) {
      return remoteDAO.invoke(constant.InterfaceEnum.GET_LST_C_B_FUND, {type})
    },
    getLastIndex(type) {
      return remoteDAO.invoke(constant.InterfaceEnum.GET_LAST_INDEX, {type})
    },
    fetchLastData () {
      Promise.all([this.getLastData(), this.getIndex(0), this.getLastIndex(0)])
        .then(res => {
          this.chartOverlapData = {
            xTime: res[0].xTime,
            in: res[0].in,
            out: res[0].out,
            shIndex: res[0].shIndex,
            indexData: res[1],
            lastIndex: res[2]
          };
        })
    }
  },
  created() {
    Loop.getInstance().register(this.fetchLastData);
  }
}
</script>

<style lang="less" scoped>
  @import '../../../assets/css/common.less';
  @import '../../../assets/css/cssReset';
</style>
